<!DOCTYPE html>
<html>
<head>
    <title>Bootstrap 实例</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/css/home.css"/>
</head>
<style type="text/css">
.nav-tabs{
	border-bottom:0px;
}
.container {
	margin-top: 8px;
	width:783px;
}
.navbar-default{
	background-color: #121311;
}
</style>
<body>
<script type="text/javascript">
	$(function(){
		$(".nav-tabs li a[k=1]").on("click",function(){
			var ifDropdown = $(this).parent().attr("class");
			if(ifDropdown.indexOf("dropdown")>=0){
			
			}else{
				$(".nav-tabs li").removeClass("active");
				$(this).parent().addClass("active"); 
			}
		});
		$(".dropdown-menu a").on("click",function(){
			$(".nav-tabs li").removeClass("active");
			$(this).parents("li[k=2]").addClass("active");
		});
	});
</script>
<!--顶部导航栏部分-->
	<nav class="navbar navbar-default">
		<div class="container-fluid">
			<div class="navbar-header">
				<div class="container">
					<div class="row">
						<div class="span6">
							<ul class="nav nav-tabs">
								<li class="active"><a href="#" k="1">主空间</a></li>
								<li class=""><a href="#" k="1">空间管理</a></li>
								<li class="dropdown" k="2"><a class="dropdown-toggle"
									data-toggle="dropdown" href="#" k="1">任务管理<b
										class="caret"></b></a>
									<ul class="dropdown-menu">
										<li><a href="#">年度计划</a></li>
										<li><a href="#">周度计划</a></li>
										<li><a href="#">周度计划</a></li>
										<li><a href="#">每日计划</a></li>
									</ul></li>
								<li class=""><a href="#" k="1">用户管理</a></li>
							</ul>
						</div>
					</div>
				</div>
			</div>
			<div class="navbar-header">
				<a class="navbar-brand" title="logoTitle" href="#">Vplans View</a>
			</div>
			<div class="collapse navbar-collapse">
				<ul class="nav navbar-nav navbar-right">
					<li role="presentation"><a href="#">当前用户：<span
							class="badge">TestUser</span></a></li>
					<li><a href="../login/logout"> <span
							class="glyphicon glyphicon-lock"></span>退出登录
					</a></li>
				</ul>
			</div>

		</div>
	</nav>
	<!-- 中间主体内容部分 -->
<div class="pageContainer">
    <!-- 左侧导航栏 -->
    <div class="pageSidebar">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <h3 class="panel-title">未完成任务</h3>
            </div>
            <div class="panel-body">
                <table class="table pageSidebarTable">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>類型</th>
                        <th>任务</th>
                        <th>状态</th>
                        <th>时间</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr class="active">
                        <td>01</td>
                        <td>周</td>
                        <td>智慧公厠項目明日部屬</td>
                        <td>進行中</td>
                        <td>2019-06-11 12:01</td>
                    </tr>
                    <tr class="success">
           <td>01</td>
                        <td>周</td>
                        <td>智慧公厠項目明日部屬</td>
                        <td>進行中</td>
                        <td>2019-06-11 12:01</td>
                    </tr>
                    <tr  class="warning">
                  <td>01</td>
                        <td>周</td>
                        <td>智慧公厠項目明日部屬</td>
                        <td>進行中</td>
                        <td>2019-06-11 12:01</td>
                    </tr>
                    <tr  class="danger">
                 <td>01</td>
                        <td>周</td>
                        <td>智慧公厠項目明日部屬</td>
                        <td>進行中</td>
                        <td>2019-06-11 12:01</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- 正文内容部分 -->
    <div class="pageContent">
        <div class="p1">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h3 class="panel-title">今日计划<a>新增</a></h3>
                </div>
                <div class="panel-body">
                    <table class="table pageContentTable">
                        <thead>
                        <tr>
                            <th>序号</th>
                            <th>任务</th>
                            <th>状态</th>
                            <th>时间</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr class="active">
                            <td>01</td>
                            <td>SpringCloud 學習</td>
                            <td>未開始</td>
                            <td>2019-06-11 12:01</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h3 class="panel-title">本年计划</h3>
                </div>
                <div class="panel-body">
                    <table class="table pageContentTable">
                        <thead>
                        <tr>
                            <th>序号</th>
                            <th>任务</th>
                            <th>状态</th>
                            <th>时间</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr class="active">
                            <td>01</td>
                            <td>SpringCloud 學習</td>
                            <td>未開始</td>
                            <td>2019-06-11 12:01</td>
                        </tr>         
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div class="p1">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h3 class="panel-title">本周计划</h3>
                </div>
                <div class="panel-body">
                    <table class="table pageContentTable">
                        <thead>
                        <tr>
                            <th>序号</th>
                            <th>任务</th>
                            <th>状态</th>
                            <th>时间</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr class="active">
                            <td>01</td>
                            <td>SpringCloud 學習</td>
                            <td>未開始</td>
                            <td>2019-06-11 12:01</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h3 class="panel-title">本月计划</h3>
                </div>
                <div class="panel-body">
                    <table class="table pageContentTable">
                        <thead>
                        <tr>
                            <th>序号</th>
                            <th>任务</th>
                            <th>状态</th>
                            <th>时间</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr class="active">
                            <td>01</td>
                            <td>SpringCloud 學習</td>
                            <td>未開始</td>
                            <td>2019-06-11 12:01</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 底部页脚部分 -->
<div class="footer">
    <p class="text-center"> </p>
</div>
</body>
</html>
